<template>
	<view class="workorderlist">
		<view class="forms">
			<view class="items"  v-show="detailList.reportType"  >
				<view class="field">
					上报类型:
				</view>
				<view class="content">
					{{detailList.reportType==0 ? '-违规消纳点':  detailList.reportType==1? '违规处置' : '渣土车违规案件'}}
				</view>
			</view>
			<view class="items"  v-show="detailList.name"  >
				<view class="field">
					名称:
				</view>
				<view class="content">
					{{detailList.name}}
				</view>
			</view>
			<view class="items" v-show="detailList.street"  >
				<view class="field">
					所属街道:
				</view>
				<view class="content">
					{{detailList.street}}
				</view>
			</view>
			<view class="items" v-show="detailList.filingNumber"  >
				<view class="field">
					立案号:
				</view>
				<view class="content">
					{{detailList.filingNumber}}
				</view>
			</view>
			<view class="items" v-show="detailList.actionCause"  >
				<view class="field">
					案由:
				</view>
				<view class="content">
					{{detailList.actionCause}}
				</view>
			</view>
			<view class="items" v-show="detailList.handingUnit"  >
				<view class="field">
					办案单位:
				</view>
				<view class="content">
					{{detailList.handingUnit}}
				</view>
			</view>
			<view class="items" v-show="detailList.arrestPersonnel"  >
				<view class="field">
					查扣人员:
				</view>
				<view class="content">
					{{detailList.arrestPersonnel}}
				</view>
			</view>
			<view class="items" v-show="detailList.filingTime"  >
				<view class="field">
					立案时间:
				</view>
				<view class="content">
					{{detailList.filingTime}}
				</view>
			</view>
			<view class="items" v-show="detailList.closingTime"  >
				<view class="field"> 
					结案时间:
				</view>
				<view class="content">
					{{detailList.closingTime}}
				</view>
			</view>
			<view class="items" v-show="detailList.departureTime"  >
				<view class="field">
					放车时间:
				</view>
				<view class="content">
					{{detailList.departureTime}}
				</view>
			</view>
			<view class="items" v-show="detailList.party"  >
				<view class="field">
					当事人:
				</view>
				<view class="content">
					{{detailList.party}}
				</view>
			</view>
			<view class="items" v-show="detailList.transportTool"  >
				<view class="field">
					运输工具:
				</view>
				<view class="content">
					{{detailList.transportTool}}
				</view>
			</view>
			<view class="items" v-show="detailList.carNumber"  >
				<view class="field">
					车牌号:
				</view>
				<view class="content">
					{{detailList.carNumber}}
				</view>
			</view>
			<view class="items" v-show="detailList.fleet"  >
				<view class="field">
					所属车队:
				</view>
				<view class="content">
					{{detailList.fleet}}
				</view>
			</view>
			<view class="items" v-show="detailList.seizureGoodsType"  >
				<view class="field">
					查获物品种类:
				</view>
				<view class="content">
					{{detailList.seizureGoodsType}}
				</view>
			</view>
			<view class="items" v-show="detailList.zhatuSource"  >
				<view class="field">
					渣土来源:
				</view>
				<view class="content">
					{{detailList.zhatuSource}}
				</view>
			</view>
			<view class="items" v-show="detailList.zhatuWhereabouts"  >
				<view class="field">
					渣土去向:
				</view>
				<view class="content">
					{{detailList.zhatuWhereabouts}}
				</view>
			</view>
			<view class="items" v-show="detailList.penaltyAmount"  >
				<view class="field">
					处罚金额:
				</view>
				<view class="content">
					{{detailList.penaltyAmount}}
				</view>
			</view>
			<view class="items" v-show="detailList.reportUserName"  >
				<view class="field">
					上报人姓名:
				</view>
				<view class="content">
					{{detailList.reportUserName}}
				</view>
			</view>
			<view class="items" v-show="detailList.isValid"  >
				<view class="field">
					是否有效:
				</view>
				<view class="content">
					{{detailList.isValid ==0 ? '失效' :'有效' }}
				</view>
			</view>

			<view class="items" v-show="detailList.address"    >
				<view class="field">
					定位地址:
				</view>
				<view class="content"  @click="navigationToEvent(detailList.lon,detailList.lat)" >
					{{detailList.address }}
				</view>
			</view>
			<view class="items" v-show="detailList.fieldValidityTerm"  >
				<view class="field">
					场地有效期:
				</view>
				<view class="content">
					{{detailList.fieldValidityTerm }}
				</view>
			</view>
			<view class="items" v-show="detailList.informationNote"  >
				<view class="field">
					情况说明:
				</view>
				<view class="content">
					{{detailList.informationNote }}
				</view>
			</view>
			<view class="items" v-show="detailList.enclosurePath"  >
				<view class="field">
					附件地址:
				</view>
					<img v-for=" item in getphotolist"   @click='previewPic' :src="item" alt=""   >
				
			</view>
			<!-- 	<view class="items"  style="display: flex;" >
					<view class="field" >
						抓拍:
					</view>
				
				</view> -->
			<view class="items" v-show="detailList.type"  >
				<view class="field">
					类型:
				</view>
				<view class="content">
					{{detailList.type }}
				</view>
			</view>
			
			<view class="items" v-show="detailList.responsibleSubject"  >
				<view class="field">
					责任主体:
				</view>
				<view class="content">
					{{detailList.responsibleSubject }}
				</view>
			</view>
			
			<view class="items" v-show="detailList.vehicleType"  >
				<view class="field">
					车辆类型:
				</view>
				<view class="content">
					{{detailList.vehicleType }}
				</view>
			</view>
			
			<view class="items" v-show="detailList.createTime"  >
				<view class="field">
					创建时间:
				</view>
				<view class="content">
					{{detailList.createTime }}
				</view>
			</view>
			<view class="items" v-show="detailList.updateTime"  >
				<view class="field">
					更新时间:
				</view>
				<view class="content">
					{{detailList.updateTime }}
				</view>
			</view>
	
	<!-- 		<view class="items">
				<view class="field">
					定位:
				</view>
				<view class="content" @click="navigationToEvent(position)" >
					{{position}}
				</view>
			</view> -->
		
		</view>
	</view>
</template>

<script>
	import { getEventDetail } from '../api/report/orderp.js'
	export default {
		components:{
		
		},
		data(){
			return{
				detailList:{
				},
				id:'',
				reportType:0,
				photos:[],
				getphotolist:[]
			}
		},
		onLoad(data) {
		
			const eventChannel = this.getOpenerEventChannel()
			// 监听getData事件，获取上一页面通过eventChannel传送到当前页面的数据
			eventChannel.on('getData', data => {
					console.log(data)
					this.id= data.id 
					this.reportType = data.reportType
			})	
			this.getDetail()
		},
		mounted() {
			
		},
		computed:{
		
		},
		methods:{
			// 导航
			navigationToEvent(lon,lat) {
				uni.getLocation({
				    type: 'wgs84', //返回可以用于uni.openLocation的经纬度
				    success: function (res) {
				        const latitude = lat;
				        const longitude =lon;
				        uni.openLocation({
				            latitude: latitude,
				            longitude: longitude,
							name:'测试地址',
							address:'浙江省杭州市xxxx',
				            success: function () {
				                console.log('success');
				            }
				        });
				    }
				});
			},
			//获取详情
			getDetail(){
				getEventDetail({
					id:this.id,
					reportType:this.reportType
				}).then(res=>{
					this.detailList = res
					if(this.detailList.enclosurePath.indexOf(',')!=-1 ){
						  this.getphotolist =  this.detailList.enclosurePath.split(',')
					}else{
						this.getphotolist = this.detailList.enclosurePath
					}
					console.log(res,33)
				})
			},
			//预览图片
			previewPic(e){
				var current = e.target.dataset.src
				uni.previewImage({
					current: current,
					urls: this.getphotolist
				})	
			}
		}
	}
</script>

<style lang="scss" scoped  >
	.workorderlist{
		margin-top: 22rpx;
		height: 100vh;
		background-color:#F2F3F5 ;
		.forms{
			margin-top: 22rpx;
			margin-bottom: 150rpx;
			background-color: #FFFFFF;
			.items{
				display: flex;
				padding: 31rpx 0 10rpx 29rpx;
				font-size: 29rpx;
				.field{
					width: 185rpx;
					
					color: #B3B5B9;
				}
				.content{
					width: 540rpx ;
					color: #363A44;
				}
			}
		}
	}
	img{
		height: 116rpx;
		width: 116rpx;
		margin-right: 20rpx;
	}
</style>
